﻿<UserControl x:Class="WpUserControls.UserControls.RoundCornerButton"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="47" d:DesignWidth="228">

    <Grid x:Name="LayoutRoot" Height="Auto" Width="Auto">
        <Border BorderBrush="Transparent" BorderThickness="3" Margin="0" Name="ButtonBorder" CornerRadius="12">
            <Border.Background>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FFF0F0F0" Offset="0" />
                    <GradientStop Color="CornflowerBlue" Offset="1" />
                </LinearGradientBrush>
            </Border.Background>
            <StackPanel Name="stackPanel" HorizontalAlignment="Center" VerticalAlignment="Center" Orientation="Horizontal">
                <Border Name="imageAheadBorder" VerticalAlignment="Center">
                    <Image HorizontalAlignment="Center" Name="image1" Stretch="Uniform" VerticalAlignment="Center" />
                </Border>
                <Border Name="textBoxBorder">
                    <TextBlock Name="textBlock" Text="TextBlock" HorizontalAlignment="Center" VerticalAlignment="Center" />
                </Border>
                <Border Name="imageTailBorder" VerticalAlignment="Center">
                    <Image HorizontalAlignment="Center" Name="image2" Stretch="Uniform" VerticalAlignment="Center" />
                </Border>
            </StackPanel>

            <!-- different layout below, but lose the ability to set Orintation -->
            <!--<Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <Image Height="Auto" HorizontalAlignment="Center" Margin="0" Name="image1" Stretch="Uniform" VerticalAlignment="Center" Width="Auto" Grid.Column="0" />
                <TextBlock Name="textBlock" Text="TextBlock" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="1" />
                <Image Height="Auto" HorizontalAlignment="Center" Margin="0" Name="image2" Stretch="Uniform" VerticalAlignment="Center" Width="Auto" Grid.Column="2" />
            </Grid>-->
        </Border>
    </Grid>
</UserControl>
